<link href="{$base_dir}index.php/css/jquery.lightbox-0.5.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="{$base_dir}js/jquery.lightbox-0.5.min.js" ></script>
{literal}
<script type="text/javascript">
    $(function() {
        $('#gallery a.lightbox').lightBox({
        	imageLoading: '../images/lightbox-ico-loading.gif',
			imageBtnClose: '../images/lightbox-btn-close.gif',
			imageBtnPrev: '../images/lightbox-btn-prev.gif',
			imageBtnNext: '../images/lightbox-btn-next.gif',
			imageBlank: '../images/lightbox-blank.gif'
        });
    });
</script>
{/literal}
<div id="thumnails">
	<div id="gallery">
	<table class='grid' id='all_thumnails' cellpadding='0' cellspacing='0'>
		<thead>
			<tr>
				<th class='first' width='320px'>{translate}Image{/translate}</th>
				<th class='last' width='260px' >{translate}Description{/translate}</th>
			</tr>
		</thead>
		<tbody>
	{foreach from=$all_thumnails item=thumnail}
		<tr id='{$thumnail.document_id}'>
			<td class='first'><a class='lightbox' href='{$thumnail.url}'><img border=0 src='{$thumnail.thumnail_url}' alt='{$thumail.name}'/></a></td>
			<td class='last' valign='top'>
				<span>{translate}Uploaded date{/translate}: {$thumnail.created}</span><br/><br/>
				<span>{translate}Description{/translate}:</span><br/>
				<div class='separator'></div>
				<span id='{$thumnail.document_id}Desc'>{$thumnail.name}</span>
			</td>
		</tr>
	{/foreach}	
	</tbody>
	</table>
	</div>
</div>